@import "~select2/src/scss/core";
@import "~select2/src/scss/multiple";
@import "~select2/src/scss/dropdown";

$s2_height: calc(1.5em + .75rem + 2px) !default;

.dark-mode {
    .select2-container {
        &--default {
            .select2-selection--single {
                background: $dark-bg-color;
                border-color: $gray-600;

                .select2-selection__rendered {
                    color: $white;
                }
            }

            .select2-results__option[aria-selected=true] {
                background-color: #7e7e7e;
            }
        }

        &--disabled {
            .select2-selection--single {
                color: $gray-400 !important;
                background-color: lighten($dark-bg-color, 15%) !important;
            }
        }

        //.select2-container--default .select2-selection--single .select2-selection__rendered

        input {
            background: $dark-bg-color;
            color: $white;
        }

        &--default .select2-selection--multiple {
            border-color: $gray-600;
            background: $dark-bg-color;
        }

        &--default.select2-container--focus .select2-selection--multiple {
            border-color: $gray-400;
            box-shadow: none;
        }
    }

    .select2-dropdown {
        background-color: $dark-bg-color;
    }

    //.select2-container--default .select2-results__option[aria-selected=true]
}

.select2-container {
    max-width: 100%;

    input {
        border-radius: 0.25rem;
        outline-style: none;
    }

    .select2-selection--single {
        box-sizing: border-box;
        cursor: pointer;
        display: block;
        height: $s2_height;
        user-select: none;
        -webkit-user-select: none;

        .select2-selection__rendered {
            display: block;
            padding-left: 8px;
            padding-right: 20px;
            overflow: hidden;
            white-space: normal;
            height: $s2_height;
        }

        .select2-selection__clear {
            position: relative;
        }
    }

    &--default {
        .select2-selection--single {
            border-color: $gray-400;
            border-radius: 0.25rem;

            .select2-selection__rendered {
                line-height: $s2_height;
                color: #666;
            }

            .select2-selection__arrow {
                height: $s2_height;
            }
        }
    }

    &--default .select2-selection--multiple {
        border-color: $gray-400;

        .select2-selection__choice {
            background-color: $primary;
            color: $white;
            border-color: transparent;

            .select2-selection__choice__remove {
                color: $white;

                &:hover {
                    color: $gray-600;
                }
            }
        }
    }

    &--default.select2-container--focus .select2-selection--multiple {
        border-color: $gray-400;
        border-radius: 0.25rem;
        box-shadow: 0 0 0 0.2rem rgba($primary, 0.25);
    }
}




[dir="rtl"] {
    .select2-container {
        .select2-selection--single {
            .select2-selection__rendered {
                padding-right: 8px;
                padding-left: 20px;
            }
        }
    }
}

